<template>
  <div class="factor-list-container" v-loading="loading">
    <CTable
      :dataSource="dataSource"
      useDataSource
      :pagination="false"
      border
      :extraTableOption="{ ...extraTableOption, mergeCells: mergeCellsList }"
    >
      <vxe-column title="范围">
        <template #default="scope">
          <span>{{
            scope.row.emissionScope
              ? getI18nNameBySeparator(scope.row.emissionScope, 'task')
              : scope.row.emissionScope
          }}</span>
        </template>
      </vxe-column>
      <vxe-column title="排放类别">
        <template #default="scope">
          <span>{{
            scope.row.emissionCategory
              ? $t18(`task.${scope.row.emissionCategory}`)
              : scope.row.emissionCategory
          }}</span>
        </template>
      </vxe-column>
      <vxe-column title="温室气体源类型">
        <template #default="scope">
          <span>{{ empty(scope.row.ghgSourceName) }}</span>
        </template>
      </vxe-column>
      <vxe-column title="排放源">
        <template #default="scope">
          <span>{{ empty(scope.row.sourceName) }}</span>
        </template>
      </vxe-column>
      <vxe-column title="能源/燃料">
        <template #default="scope">
          <span>{{ empty(scope.row.materialName) }}</span>
        </template>
      </vxe-column>
      <vxe-column title="产生的温室气体">
        <template #default="scope">
          <span>{{ empty(scope.row.gas) }}</span>
        </template>
      </vxe-column>
      <vxe-column title="排放系数" align="right">
        <template #default="scope">
          <span>{{ empty(numberFormat(scope.row.gasEmissionCoefficient, 6)) }}</span>
        </template>
      </vxe-column>
      <vxe-column title="因子单位">
        <template #default="scope">
          <span> {{ empty(scope.row.factorUnit) }}</span>
        </template>
      </vxe-column>
      <vxe-column title="排放因子来源" width="200">
        <template #default="scope">
          <span>{{ FactorSourceTypeEnum[scope.row.emissionCoefficientSource] }}</span>
        </template>
      </vxe-column>
    </CTable>
  </div>
</template>
<script lang="ts" setup>
import { defineProps, withDefaults, watch } from 'vue';
import { useList } from './useList';
import { CTable } from '@/components/CTable/index';
import { empty, getI18nNameBySeparator, numberFormat } from '@/utils/index';
import { FactorSourceTypeEnum } from '@/constants/enum';
interface IProps {
  standard: string;
}
const props = withDefaults(defineProps<IProps>(), {
  standard: ''
});
const { dataSource, extraTableOption, loadData, mergeCellsList, loading } = useList(props);
watch(
  () => props.standard,
  () => {
    loadData();
  }
);
</script>

<style lang="scss" scoped>
.factor-list-container {
  min-height: 80%;
}
</style>
